<template>
  <div class="demo">
     <h2>学校名称:{{ schoolName }}</h2>
     <h2>学校地址:{{ schooleAddress }}</h2>
     <!-- <h2>获取vue原型对象上的x{{ x }}</h2> -->
     <span>获取到student传递过来的stuname：{{ stuName}}</span>
   </div>
</template>

<script>
export default {
    name:"School",
    data:function(){
        return {
            schoolName:'武汉科技大学',
            schooleAddress:"武汉市武昌区",
            //x:this.x  //此时的x的查找路径为 School组件的VueComponent实例对象-->VueComponent的原型对象-->vue的原型对象
            stuName:''
        }
    },
    methods:{
        // 方式1：向事件总线上注册事件，和定义事件的回调
        // getMessageName(){
        //     this.x.$on("messageName",(data) =>{
        //         console.log("获取到student传递过来的stuname",data)
        //         this.stuName = data  //注意这里不能直接return
        //     })
        // }
    },
    mounted(){
        //方式2：向事件总线上注册事件，和定义事件的回调
        this.x.$on("messageName",(data) =>{
                console.log("获取到student传递过来的stuname",data)
                this.stuName = data
            })
    },
    beforeDestroy(){
        //在vc销毁前触发解绑事件
        this.x.$off("messageName")
    }
}
</script>

<style lang="css" scoped>
    .demo{
        background-color: green;
    }
</style>